﻿<UserControl 
    x:Class="Caliburn.Micro.BikeWizard.Views.BikeWizardView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:views="clr-namespace:Caliburn.Micro.BikeWizard.Views"
    mc:Ignorable="d"
    xmlns:converters="clr-namespace:Caliburn.Micro.BikeWizard.Converters"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    d:DesignHeight="600" d:DesignWidth="800">

    <UserControl.Resources>
        <converters:BooleanConditionConverter x:Key="booleanConditionConverter" />

        <converters:ConditionalValue x:Name="OuterBorderOpacityConditionalValue" ConditionTrueValue="1" ConditionFalseValue="0.25" />
        <converters:ConditionalValue x:Name="InnerBorderBackGroundConditionalValue" ConditionTrueValue="BurlyWood" ConditionFalseValue="#FFFEFEFE" />
        <converters:ConditionalValue x:Name="TextBlockFontWeightConditionalValue" ConditionTrueValue="Bold" ConditionFalseValue="Normal" />

        <Style TargetType="Button">
            <Setter Property="Padding" Value="3.5,0" />
            <Setter Property="Margin" Value="3.5" />
            <Setter Property="MinWidth" Value="80" />
        </Style>

        <ItemsPanelTemplate x:Key="wizardTemplate">
            <StackPanel Orientation="Vertical" />
        </ItemsPanelTemplate>
       
        <DataTemplate x:Key="wizardStepTemplate">         
            <Border
                x:Name="bdOuter"
                BorderBrush="Black"
                BorderThickness="0,0,1,1"
                CornerRadius="12"
                Margin="1,1,1,12"
                Opacity="{Binding IsActive, Converter={StaticResource booleanConditionConverter}, ConverterParameter={StaticResource OuterBorderOpacityConditionalValue}}"
                >
                <Border
                    x:Name="bdInner"
                    Background="{Binding IsActive, Converter={StaticResource booleanConditionConverter}, ConverterParameter={StaticResource InnerBorderBackGroundConditionalValue}}"
                    BorderBrush="Brown"
                    BorderThickness="2,2,1,1"
                    CornerRadius="12"
                    Padding="2"
                    >
                    <TextBlock
                        x:Name="txt"
                        Margin="4,0,0,0"
                        FontWeight="{Binding IsActive, Converter={StaticResource booleanConditionConverter}, ConverterParameter={StaticResource TextBlockFontWeightConditionalValue}}"
                        Text="{Binding Path=DisplayName}" 
                        />
                </Border>
            </Border>
        </DataTemplate>
    </UserControl.Resources>

    <Grid Background="#11000000" Margin="1" Width="500" Height="400">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="auto" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="40" />
        </Grid.RowDefinitions>

        <!-- WIZARD STEP LISTING -->
        <ContentControl Margin="5">
            <ItemsControl 
                x:Name="Items" 
                ItemsPanel="{StaticResource wizardTemplate}" 
                ItemTemplate="{StaticResource wizardStepTemplate}">
            </ItemsControl>
        </ContentControl>

        <!-- CURRENT PAGE AREA -->
        <Border Background="White" Grid.Column="1" Grid.Row="0">
            <ContentControl 
                x:Name="ActiveItem" 
                Margin="5" 
                HorizontalAlignment="Stretch" 
                VerticalAlignment="Stretch" 
                HorizontalContentAlignment="Stretch" 
                VerticalContentAlignment="Stretch" />
        </Border>

        <Border
            Grid.Column="0"
            Grid.Row="1"
            Margin="0,7,0,0"
            Background="LightGray"
            Grid.ColumnSpan="2">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <!-- PRICE -->
                <TextBlock
                    FontWeight="Bold"
                    Text="Price"
                    Margin="4,0,7,0"
                    VerticalAlignment="Center" />
                <TextBlock
                    x:Name="TotalPrice"
                    Grid.Column="1"
                    Text="{Binding Path=TotalPrice, StringFormat=c}"
                    VerticalAlignment="Center" 
                    />

                <!-- NAVIGATION BUTTONS -->
                <Grid
                    Grid.Column="2"
                    HorizontalAlignment="Right">
                    
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                        <ColumnDefinition />
                        <ColumnDefinition Width="11" />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <Button
                        x:Name="MovePrevious"
                        Grid.Column="0"
                        Grid.Row="0"
                        Content="Previous" 
                        />
                    <Button
                        x:Name="MoveNext"
                        Grid.Column="1"
                        Grid.Row="0"
                        Content="{Binding MoveNextCaption}"
                        />
                    <Button
                        x:Name="Cancel"
                        Grid.Column="3"
                        Grid.Row="0"
                        Content="Cancel"
                        />
                </Grid>
            </Grid>
        </Border>
    </Grid>
</UserControl>
